<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			/*
			TODO: 操作标签体
				标签对象.innerText : 获取标签体的文本内容
				标签对象.innerHTML : 获取标签体的所有内容
				标签对象.innerText = 值 : 设置标签体的文本内容
				标签对象.innerHTML = 值 : 设置标签体的内容
			*/
			function getVal() {
				// 获取标签对象
				let sp1Obj = document.getElementById("sp1");
				// 获取标签体的内容
				//alert("innerText获取: "+sp1Obj.innerText);
				//alert("innerHTML获取: "+sp1Obj.innerHTML);
				//=================
                // 获取标签对象
                let sp2Obj = document.getElementById("sp2");
                // 获取标签体的内容
                alert("innerText获取: "+sp2Obj.innerText);
                alert("innerHTML获取: "+sp2Obj.innerHTML);
            }
            
            function setVal() {
                // 获取标签对象
                let sp1Obj = document.getElementById("sp1");
				// 设置标签体内容
				//sp1Obj.innerText = "<font color='red'>嘻嘻哈哈嘿嘿嘿</font>";
				sp1Obj.innerHTML = "<font color='red'>嘻嘻哈哈嘿嘿嘿</font>";
            }
		</script>
	</head>
	<body>
		<span id="sp1">佑我中华</span><br />
		<span id="sp2"><font color="red">佑我中华</font></span><br />
		<input type="button" value="获取标签体的内容" onclick="getVal()"/>
		<input type="button" value="设置标签体的内容" onclick="setVal()"/>
	</body>
</html>
